#@layoutT("")
#define main()
<div class="container-wrap">
    #@formStart()
    #@queryStart('设备ID')
    <input type="search" name="devideid" autocomplete="off" class="layui-input" placeholder="设备ID"/>
    #@queryEnd()
    #@formEnd()
	
	<!-- 主表数据 -->
	#@table()
	
	<!-- 从表Tab页签-->
	#@subTable(['手环绑定用户'])
</div>	
#end

#define js()

<!-- 引入从表js-->
#@subTableJs()


<script type="text/html" id="status">
    {{ d.status == 'OFF' ? '下线' : '上线' }}
</script>
<!-- 主表 -->
<script>
    gridArgs.title='';
    gridArgs.dataId='devideid';
    gridArgs.deleteUrl='#(path)/portal/business/iDeviceInfo/delete';
    gridArgs.updateUrl='#(path)/portal/business/iDeviceInfo/edit/';
    gridArgs.addUrl='#(path)/portal/business/iDeviceInfo/add';
    gridArgs.heightDiff=340;//调整表格高度
    gridArgs.gridDivId ='maingrid';
    initGrid({id : 'maingrid'
        ,elem : '#maingrid'
        ,toolbar:'#table_toolbar'//开启头部工具栏，并为其绑定左侧模板
        ,cellMinWidth: 100
        ,cols : [ [
            {title: '主键',field : 'devideid',width : 35,checkbox : true},
				 {title: '设备ID',field : 'devideid'},
				 {title:'经度',field:'latitude'},
				 {title:'纬度',field:'longitude'},
				 {title:'心率',field:'heartrate'},
				 {title:'体温',field:'bodytemperature'},
				 {title:'收缩压',field:'systolicpressure'},
				 {title:'舒张压',field:'diastolicpressure'},
				 {title:'血氧',field:'bloodoxygen'},
				 {title:'状态',field:'status',id:'#status'},
				 {title:'步数',field:'stepcount'},
				 {title:'上线时间',field:'onlinetime'},
				 {title:'下线时间',field:'offlinetime'},
            {fixed:'right',width : 180,align : 'left',toolbar : '#bar_maingrid'}
            ] ]
        ,url:"#(path)/portal/business/iDeviceInfo/list"
        ,searchForm : 'searchForm'
    });

   
</script>



<!-- 从表 -->
<script>
//从表1
function renderSubTable1(refId){
		var editTable=new EditTable();
		var config=editTable.config;
		//除了第一个用默认配置,其他表格都要配置自己的参数
		config.tableId='tab_item_1';//表Id
		config.addBtnId='add_btn_1';//添加按钮ID
		config.delEvent='del_btn_1';//删除按钮Even值
		config.toolbar='table_toolbar_1';//表头工具ID
		config.rowbar='table_rowbar_1';//行按钮ID
		config.saveBtnId="save_btn_1";//保存表格接口
		config.queryUrl='#(path)/portal/business/iCustomerInfo/list';//查询接口
		config.params={"devideid":refId};//查询参数
		config.saveUrl='#(path)/portal/business/iCustomerInfo/saveTableData?type=formTable&refId='+refId;//保存接口
		config.deleteUrl='#(path)/portal/business/iCustomerInfo/modify?devideid'+refId;//删除接口
		config.rowData={"gender":"","idcard":"","phonenum":"","inputtime":"","id":"","customername":"","updatetime":"","devideid":"","age":""};
		editTable.render(config,{
			 elem: '#'+config.tableId
		     ,height: '300'
		     ,toolbar:'#'+config.toolbar
		     ,cols: [[ 
				 {title:'姓名',field:'customername',edit:true },
				 {title:'性别',field:'gender',edit:true },
				 {title:'年龄',field:'age',edit:true },
				 {title:'联系方式',field:'phonenum',edit:true },
				 {title:'证件号',field:'idcard',edit:true },
				 {title:'设备ID',field:'devideid',edit:true },
					,{fixed: 'right', title:'操作', toolbar: '#'+config.rowbar,width:100 }
				]]
		});
	}
	
</script>

#end

<!-- 监听主表点击事件 --> 
#define layuiFunc()
  //监听行单击事件（双击事件为：rowDouble）
  table.on('row(maingrid)', function(obj){
    var data = obj.data;
    var refId=data.devideid;
    //渲染从表数据
    renderSubTable1(refId);
	
     //标注选中样式
    obj.tr.addClass('layui-table-click').siblings().removeClass('layui-table-click');
    
  });
#end
